<template>
  <div id="chart" style="width:400px; height: 250px; margin-top: -60px;"></div>
</template>
<script>
import echarts from 'echarts'
export default {
  name: 'Chart',
  data(){
    return{
      i:0,
      oderlist:[]
    }
  },
  mounted() {
    this.$axios.get("/orders/count1").then(res=>{
      if(res.data.code == 200){
        this.oderlist = res.data.data
        console.log(this.oderlist)
      }
      this.initChart()
    })
  },
  methods: {
    initChart() {
      let chart = echarts.init(document.getElementById('chart'))
      let option = {
        title: {
    left: 'center'
  },
  tooltip: {
    trigger: 'item'
  },
  legend: {
    orient: 'vertical',
    left: 'left'
  },
  series: [
    {
      name: '',
      type: 'pie',
      radius: '80%',
      data: this.oderlist,
      emphasis: {
        itemStyle: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
      }
    }
  ]
    }
    chart.setOption(option)
  }
}
}
</script>
